/* eslint-disable no-undef */
// #ifdef APP-NVUE
const dom = weex.requireModule('dom')
// #endif
export default {
  data() {
    return {
      uniShow: false,
      left: 0
    }
  },
  computed: {
    moveLeft() {
      return `translateX(${this.left}px)`
    }
  },
  watch: {
    show(newVal) {
      if (!this.position || JSON.stringify(this.position) === '{}') return
      if (this.autoClose) return
      if (newVal) {
        this.$emit('change', true)
        this.open()
      } else {
        this.$emit('change', false)
        this.close()
      }
    }
  },
  mounted() {
    this.position = {}
    if (this.swipeaction.children !== undefined) {
      this.swipeaction.children.push(this)
    }
    setTimeout(() => {
      this.getSelectorQuery()
    }, 100)
  },
  beforeDestoy() {
    this.swipeaction.children.forEach((item, index) => {
      if (item === this) {
        this.swipeaction.children.splice(index, 1)
      }
    })
  },
  methods: {
    onClick(index, item) {
      this.$emit('click', {
        content: item,
        index
      })
      this.close()
    },
    touchstart(e) {
      const {
        pageX
      } = e.touches[0]
      if (this.disabled) return
      const left = this.position.content.left
      if (this.autoClose) {
        this.swipeaction.closeOther(this)
      }
      this.width = pageX - left
      if (this.isopen) return
      if (this.uniShow) {
        this.uniShow = false
        this.isopen = true
        this.openleft = this.left + this.position.button.width
      }
    },
    touchmove(e, index) {
      if (this.disabled) return
      const {
        pageX
      } = e.touches[0]
      this.setPosition(pageX)
    },
    touchend() {
      if (this.disabled) return
      if (this.isopen) {
        this.move(this.openleft, 0)
        return
      }
      this.move(this.left, -40)
    },
    setPosition(x, y) {
      if (!this.position.button.width) {
        return
      }
      // this.left = x - this.width
      this.setValue(x - this.width)
    },
    setValue(value) {
      // 设置最大最小值
      this.left = Math.max(-this.position.button.width, Math.min(parseInt(value), 0))
      this.position.content.left = this.left
      if (this.isopen) {
        this.openleft = this.left + this.position.button.width
      }
    },
    move(left, value) {
      if (left >= value) {
        this.$emit('change', false)
        this.close()
      } else {
        this.$emit('change', true)
        this.open()
      }
    },
    open() {
      this.uniShow = true
      this.left = -this.position.button.width
      this.setValue(-this.position.button.width)
    },
    close() {
      this.uniShow = true
      this.setValue(0)
      setTimeout(() => {
        this.uniShow = false
        this.isopen = false
      }, 300)
    },
    getSelectorQuery() {
      // #ifndef APP-NVUE
      const views = uni.createSelectorQuery()
        .in(this)
      views
        .selectAll('.selector-query-hock')
        .boundingClientRect(data => {
          this.position.content = data[1]
          this.position.button = data[0]
          if (this.autoClose) return
          if (this.show) {
            this.open()
          } else {
            this.close()
          }
        })
        .exec()
      // #endif
      // #ifdef APP-NVUE
      dom.getComponentRect(this.$refs['selector-content-hock'], (data) => {
        if (this.position.content) return
        this.position.content = data.size
      })
      dom.getComponentRect(this.$refs['selector-button-hock'], (data) => {
        if (this.position.button) return
        this.position.button = data.size
        if (this.autoClose) return
        if (this.show) {
          this.open()
        } else {
          this.close()
        }
      })
      // #endif
    }
  }
}
